<template>
  <div class="page">
	<div class="layui-fluid">
			<div class="layui-row layui-col-space15">
				<div class="layui-col-md12">
					<div class="layui-card">

						<div class="layui-card-body">
							<div class="layui-form" lay-filter="">

								<div class="layui-form-item">
									<div class="layui-inline">
									    <label class="layui-form-label">标题</label>
									    <div class="layui-input-inline" style="width: 380px;">
									        <input type="text" name="name" placeholder="标题"  v-model="itemData.title" autocomplete="off" class="layui-input a" >
									    </div>
								  </div>
								</div>
								<div class="layui-form-item">
									<div class="layui-inline">
									    <label class="layui-form-label">副标题 </label>
									    <div class="layui-input-inline" style="width: 380px;">
									        <input type="text" name="name" placeholder=""  v-model="itemData.subtitle" autocomplete="off" class="layui-input">
									    </div>
								  </div>
								</div>
								<div class="layui-form-item">
									<div class="layui-inline">
									    <label class="layui-form-label">所属目录</label>
									     <div class="layui-input-block">
										    <div class="layui-input-inline" style="width: 180px;margin-bottom:10px" v-for='(item,index) in categorylist'>
										       <select lay-filter="cat"  :name="'cat'+index">
														<option :value=it.id v-for='it in item' :selected="it.id==itemData.categoryList[index].id">{{it.categoryName}}</option>
													</select>
										    </div>
										  </div>
								  </div>
								</div>
						    <div class="layui-form-item">
						      <label class="layui-form-label">资讯图片</label>
						      <div class="layui-input-inline">
						         <div class="layui-upload">
										  <button type="button" class="layui-btn" id="layuiadmin-upload-useradmin">上传图片</button>
										  <div class="layui-upload-list">
										    <img class="layui-upload-img" id="logo" :src="itemData.titlePic?itemData.titlePic:'http://kedoujfpc.tongdui365.com/static/common/image/zwyl.jpg'" width="100" height="100" style="border:1px solid #eee;">
										    <p id="demoText"></p>
										  </div>
										</div>
						      </div>

						    </div>
						   <div class="layui-form-item">
									<div class="layui-block">
									    <label class="layui-form-label">内容</label>
									    <div class="layui-input-inline" style="width:80%;">
									        <textarea id="demo" style="display: none;">{{itemData.content}}</textarea>
									    </div>
								  </div>
								</div>
						    <div class="layui-form-item" v-for="item in videoLink">
				        	<label class="layui-form-label">视频地址</label>
				        	<div class="layui-input-block" style="width:380px">
										<input type="text" name="name" placeholder="视频播放地址"  v-model="item.videoLink" autocomplete="off" class="layui-input a">

									</div>
				        </div>



								<div class="layui-form-item">
									<div class="layui-input-block">
										<button class="layui-btn layui-btn-normal" lay-submit lay-filter="setmyinfo" @click="confirmOk">确认</button>
										<button class="layui-btn layui-btn-danger" lay-submit @click="addvideo">添加视频</button>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
  </div>
</template>
<script>

export default {
  name: 'goodsfladd',
  data () {
    return {
    	id:'',
    	itemData:{
			  "title": "",
			  "subtitle": "",
			  "outLink": "",
			  "titlePic": "",
        content:'',
			  categoryList:[[{id:''}],[{id:''}],[{id:''}]]
			},
    	categorylist:[[]],
    	videoLink:[],
    	categoryId:'',
    	layedit:'',
    	layeditindex:'',
    	type:localStorage.getItem("type"),
    }
  },
  mounted(){
    var _this = this;
    this.getcat(0,0)
    layui.use('upload', function(){
		  var upload = layui.upload;
		  var uploadInst = upload.render({
		    elem: '#layuiadmin-upload-useradmin',//绑定元素
		    data:{
		    	type:3
		    }
		    ,url:imguploadurl //上传接口
		    ,done: function(res){
		    	layer.msg('上传成功');
		    	 _this.itemData.titlePic=res.msg;
		    }
		    ,error: function(){
		      layer.msg('上传失败');
		    }
		  });
		});
  	window.getdates = this.getdates;
  	layui.use('layedit', function(){
		  var layedit = layui.layedit;
		  layedit.set({
			  uploadImage: {
			     url: imguploadurl
			    ,type: 'post',
          data:{
          	type:3
          }
			  }
			});
			_this.layedit=layui.layedit
		  var index=layedit.build('demo');
		  _this.layeditindex=index;
		});
  },
  methods: {
		getdates:function(res){
      var _this=this;
      this.id=res.id;
      if(_this.type=='1'){
         var url='/advert/aapi/v1.9/news/'+res.id;
      }else{
      	 var url='/advert/bapi/v1.9/news/'+res.id;
      }
      ajaxRequest(url, 'GET', 'json','', function(ret, err){
        _this.itemData=ret.data;
        _this.videoLink=ret.data.addressDTOList;
        setTimeout(function(){
          _this.layedit.setContent(_this.layeditindex,ret.data.content, false);
        },600)
        if(ret.data.category.categoryList){
          var arr=ret.data.category.categoryList;
          _this.itemData.categoryList=arr;
          var narr=[];
          for(var i=0;i<arr.length;i++){
          	if(i==0){
          		var id=0;
          	}
          	else{
          		var d=i-1;
          		var id=arr[d].id
          	}
          	var url='/advert/papi/v1.9/category/parent/'+id;
          	ajaxRequest(url, 'GET', 'json','', function(ret, err){
          			var deep=ret.data[0].deep-1;
          			narr[deep]=ret.data;
          			_this.categorylist=narr;
          		  _this.$forceUpdate();
          	})
          }
        }
        else{
          _this.itemData.categoryList=[[{id:''}],[{id:''}],[{id:''}]];
        }
      })
		},
		addvideo:function(){
			var obj={
		      "logo": "",
		      "videoDownloadLink": "",
		      "videoLink": "",
		      "videoName": "",
		      "videoSize": 0
		    }
		  var arr=this.videoLink;
		  arr.push(obj);
		  this.videoLink=arr;
		},
		getcat:function(id,step){
		
			var url=dourl('/advert/aapi/v1.9/category/parent/'+id);
			var _this=this;
			ajaxRequest(url, 'GET', 'json','', function(ret, err){
				var arr=_this.categorylist;
				var narr=[];
				if(ret.data.length>0){
					arr[step]=ret.data;
					_this.categoryId=ret.data[0].id;
					narr=arr
				}
				else{
					for(var i=0;i<step;i++){
						narr.push(arr[i])
					}
				}
				_this.categorylist=narr;
				_this.itemData.categoryList=narr
			  _this.$forceUpdate();
			})
		},
  	confirmOk:function(){
		  
		  var _this = this;
			var len = $(".a").length;
			for(var i = 0; i < len; i++) {
				if($(".a").eq(i).val() == ''||$(".a").eq(i).val()<=0) {
					var msg = $(".a").eq(i).attr("placeholder");
					layer.msg('请输入正确的'+msg);
					return;
				}
			}
			var pot='POST'
			var dates=this.itemData;
			if(this.id){
				dates.id=this.id;
				pot='PUT';
			}
			var obj={};
			obj.id=this.categoryId;
			dates.category=obj;
			dates.content=_this.layedit.getContent(this.layeditindex);
			if(_this.videoLink && _this.videoLink.length>0){
				dates.addressDTOList=this.videoLink
			}
			if(_this.type=='1'){
	  	   var url='/advert/aapi/v1.9/news';
	    }else{
	  	   var url='/advert/bapi/v1.9/news';
	    }
	  	//alert(JSON.stringify(dates))
			ajaxRequest(url, pot, 'json',dates, function(ret, err){

			  layer.msg("操作成功");
			  setTimeout(function(){
			  	var index = parent.layer.getFrameIndex(window.name);
			    parent.layer.close(index);
		      parent.location.reload();
	      },1000)
			})
  	}
  },
  updated:function(){
  	var _this=this;

		layui.use('form', function(){
		  var form = layui.form;
		  form.render();
		  form.on('select(cat)', function(data){
				 	_this.categoryId=data.value;
				 	var name=data.elem.getAttribute('name');
				 	var arr=name.split("cat");
				  if(data.value==0){
				  	_this.getcat(data.value,0)
				  }
				  else{
				 		_this.getcat(data.value,parseInt(arr[1])+1)
				 	}
			});

		});

  },
}
</script>
<style scoped>
</style>
